<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <script src="js/jquery3.3.1.min.js"></script>
    <!-- <script src="js/vue.min.js"></script> -->
    <script src="https://cdn.jsdelivr.net/npm/vue@2.5.16/dist/vue.js"></script>
    <link rel="stylesheet" href="css/css/bootstrap.css">
    <link rel="stylesheet" href="css/css/animation.min.css">
    <link rel="stylesheet" href="css/css/font-awesome.min.css">
    <script src="js/bootstarp.js"></script>
    <script src="js/highcharts.js"></script>
    <script src="js/highcharts_zh.js"></script>
    <script src="js/myStorage.min.js"></script>
    <script src="js/webSQL.js"></script>
    <title>微生物检测记录</title>
    <style>
        .threed {
            text-shadow: 0px 1px 0px #999, 1px 2px 1px #888, 2px 3px 2px #777, 3px 4px 3px #666, 4px 5px 4px #555, 5px 6px 5px #444, 6px 7px 6px #333, 7px 8px 7px #222, 8px 9px 8px #111
        }
    </style>
</head>

<body>
    <div class="container">
        <div id="wsw">
            <div class="jumbotron row">
                <div onclick="focus_move()" class="col-xs-9 col-lg-10 col-md-10 col-sm-10">
                    <h2 data-toggle="modal" data-target="#login" v-text="company"></h2>
                    <h1 style="color:gainsboro" class="threed">水质检验回归分析系统</h1>
                </div>
                <img src="img/myWeixin.jpg" alt="" srcset="" class="back1">
                <div class="col-xs-3 col-lg-2 col-md-2 col-sm-2">
                    <a class="btn btn-success btn-lg" data-toggle="modal" data-target="#environment" v-else>
                        <i class="fa fa-thermometer"> 环境记录</i>
                    </a>
                    <a class="btn btn-lg btn-info" href="sample.html">
                        <i class="fa fa-print">检验报告</i>
                    </a>
                    <div class="modal fade" id="environment" tabindex="-1" role="dialog" aria-labelledby="myEnv"
                        aria-hidden="true">
                        <div class="modal-dialog">
                            <div class='modal-content'>
                                <div class="modal-header">
                                    <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
                                    <h4 class="modal-title" id="myEnv">实验室环境</h4>
                                </div>
                                <div class="modal-body form-group">
                                    <label class="form-label">实验室温度(℃)</label>
                                    <input type="number" v-model.number="T">℃
                                    <label calss="form-label">实验室湿度(%)</label>
                                    <input tabindex="0" type="number" v-model.number="H">%
                                </div>
                                <div class="modal-footer">
                                    <button type="button" class="btn btn-primary" tabindex="0" @click="login_env()"
                                        data-dismiss="modal">确认</button>
                                </div>
                            </div><!-- /.modal-content -->
                        </div><!-- /.modal -->
                    </div>
                </div>
            </div>
            <div class="row">
                <i class="fa fa-calendar" v-text="dateFormat(new Date())"></i>
            </div>
            <br>

            <form v-if="show4" class="animated bounceInRight">
                <div class="row">
                    <div class="col-lg-4">
                        <fieldset>
                            <div>
                                <a class="btn btn-default" @click="add_sample(selected4)">
                                    <i class="fa fa-hand-o-right fa-2x"></i><i class="fa fa-pencil"></i>
                                    开始录入
                                    样品编号<i v-text="numbering+(new Date()).getFullYear()"></i>水第
                                    <input v-if="selected4.judge==true" tabindex="11" type="number" v-model="selected4.start">
                                    <input v-else-if="selected4.judge==false" type="number" v-model="selected4.end">
                                    号
                                </a>
                            </div>
                        </fieldset>
                    </div>
                    <div class="col-lg-8">
                        <fieldset v-if="add" class="animated fadeInRight">
                            <legend>样品中 <span v-text="selected4.name">
                                </span> 结果记录</legend>
                            <table class="table table-hover table-bordered table-striped">
                                <tr>
                                    <th class="text-center">样品编号</th>
                                    <th class="text-center">菌落总数</th>
                                    <th class="text-center">总大肠菌群</th>
                                    <th class="text-center">大肠埃希氏菌</th>
                                    <th class="text-center">耐热大肠菌群</th>
                                </tr>
                                <tr class="text-center">
                                    <td>
                                        <i><span v-text="numbering+(new Date()).getFullYear()">
                                            </span>水第<span v-text="f_n(selected4.start,3)">
                                            </span>号</i>
                                    </td>
                                    <td>
                                        <input v-model="selected4.result.a" class="form-control animated bounceInRight" type="text" >
                                    </td>
                                    <td>
                                        <input v-model="selected4.result.b" class="form-control animated bounceInRight" type="text">
                                    </td>
                                    <td>
                                        <input v-model="selected4.result.c" v-if="dc" class="form-control animated bounceInRight" type="text">
                                    </td>
                                    <td>
                                        <input v-model="selected4.result.d" v-if="dc" class="form-control animated bounceInRight" type="text">
                                    </td>
                                    <!-- <td>
                                        <input class="form-control animated bounceInRight" type="number" tabindex="0"
                                            placeholder="输入完成直接按回车键" @keyup.enter="work(selected4)" placeholder="输入后直接回车" v-model="selected4.result.a">
                                    </td> -->
                                </tr>
                            </table>
                        </fieldset>
                    </div>
                </div>

                <a class="btn text-danger" @click="printContent('print4')"><i class="fa fa-print"></i>打印记录</a>
                <div id="print4">
                    <div @click="date_y()" class="text-center" colspan="5">
                        <h1 v-text="company"></h1>
                        <h3 title="点击这里可以查看每个样品的检测日期"><i>水样中<span v-text="selected4.name">
                                </span>检验记录</i></h3>
                    </div>
                    <table class="table table-bordered table-striped table-hover">
                        <thead>
                        <tr>
                            <td class="text-center">样品名称：</td>
                            <td colspan="1" contenteditable="true" v-text="selected4.name"></td>
                            <td class="text-center">样品编号：</td>
                            <td colspan="2" contenteditable="true" v-text="selected4.id"></td>
                        </tr>
                        <tr>
                            <td class="text-center">检测项目：</td>
                            <td contenteditable="true">菌落总数|总大肠菌群|大肠埃希氏菌|耐热大肠菌群</td>
                            <td class="text-center">检验日期：</td>
                            <td colspan="2" contenteditable="true" v-text="test_date"></td>
                        </tr>
                        <tr>
                            <td class="text-center">检测依据：</td>
                            <td contenteditable="true">GB/T5750.12-2006</td>
                            <td class="text-center">检测仪器：</td>
                            <td contenteditable="true"></td>
                        </tr>
                        <tr>
                            <td class="text-center">检测环境：</td>
                            <td colspan="3">
                                <span>无菌室</span>
                                温度<span v-text="T">
                                </span>℃
                                湿度
                                <span v-text="H">
                                </span>% RH
                            </td>
                        </tr>
                    </table>
                    <table class="table-bordered table-hover table-striped">
                        <tr>
                            <td colspan="2" rowspan="4">菌落总数</td>
                            <td>稀释度（倍）</td>
                            <td colspan="4">1</td>
                            <td colspan="4">0.1</td>
                            <td colspan="4">0.01</td>
                            <td colspan="4">0.001</td>
                            <td colspan="4">空白</td>
                        </tr>
                        <tr>
                            <td>培养条件</td>
                            <td>温度：</td>
                            <td colspan="9"></td>
                            <td>时间：</td>
                            <td colspan="9"></td>
                        </tr>
                        <tr>
                            <td>平板菌落数</td>
                            <td colspan="20"></td>
                        </tr>
                        <tr>
                            <td>报告值（CFU/mL)</td>
                            <td colspan="20"></td>
                        </tr>
                        <tr>
                            <td rowspan="14">总大肠菌群</td>
                            <td rowspan="7">发酵法</td>
                            <td>培养基名称</td>
                            <td colspan="19">乳糖蛋白胨培养液</td>
                        </tr>
                        <tr>
                            <td>稀释度（加样量）</td>
                            <td colspan="5">10ml</td>
                            <td colspan="5">1ml</td>
                            <td colspan="5">0.1ml</td>
                            <td colspan="5"></td>
                        </tr>
                        <tr>
                            <td>初发酵（℃/h）</td>
                            <td></td>
                            <td></td>
                            <td></td>
                            <td></td>
                            <td></td>
                            <td></td>
                            <td></td>
                            <td></td>
                            <td></td>
                            <td></td>
                            <td></td>
                            <td></td>
                            <td></td>
                            <td></td>
                            <td></td>
                            <td></td>
                            <td></td>
                            <td></td>
                            <td></td>
                            <td></td>
                        </tr>
                        <tr>
                            <td>分离平板</td>
                            <td colspan="20"></td>
                        </tr>
                        <tr>
                            <td>革兰氏染色</td>
                            <td colspan="20"></td>
                        </tr>
                        <tr>
                            <td>复发酵（℃/h）</td>
                            <td colspan="20"></td>
                        </tr>
                        <tr>
                            <td>报告值(MPN/100ml)</td>
                            <td colspan="20"></td>
                        </tr>
                        <tr>
                            <td rowspan="7">酶底物法</td>
                            <td colspan="21">100ml水样加入2.7g±0.5 g MMU-MUG培养基粉末：摇匀使之溶解</td>
                        </tr>
                        <tr>
                            <td>定性反应：</td>
                            <td colspan="21"><span v-text="T"></span>℃培养<span v-text="h"></span>h</td>
                       </tr>
                        <tr>
                            <td colspan="9">结果判读：<label v-model="result">无变化<input type="radio">颜色变黄<input type="radio"></label></td>
                            <td colspan="4">报告</td>
                            <td colspan="9" v-model="result1"></td>
                        </tr>
                        <tr>
                            <td colspan="22">10管法：分装10管<span v-text="T"></span>℃培养<span v-text="h"></span>h</td>
                        </tr>
                        <tr>
                            <td colspan="9">结果判读：黄色反应的试管数：<span v-model="num"></span></td>
                            <td colspan="4">报告值(MPN/100ml)</td>
                            <td colspan="9" v-model="result10"></td>
                        </tr>
                        <tr>
                            <td colspan="22">51孔定量盘法：加入51孔定量盘内排气封口<span v-text="T51"></span>℃,培养<span v-model="h51"></span>h
                                </td>
                        </tr>
                        <tr>
                            <td colspan="9">结果判读：黄色反应的孔穴数：<span v-model="num"></span></td>
                            <td colspan="4">报告值(MPN/100ml)</td>
                            <td colspan="9" v-text="result51"></td>
                        </tr>
                        <tr>
                            <td colspan="2" rowspan="5">耐热大肠菌群</td>
                            <td>培养基名称</td>
                            <td colspan="20"></td>
                        </tr>
                        <tr>
                            <td>稀释度（加样量）</td>
                            <td colspan="5">10ml</td>
                            <td colspan="5">1ml</td>
                            <td colspan="5">0.1ml</td>
                            <td colspan="5"></td>
                        </tr>
                        <tr>
                            <td>发酵</td>
                            <td></td>
                            <td></td>
                            <td></td>
                            <td></td>
                            <td></td>
                            <td></td>
                            <td></td>
                            <td></td>
                            <td></td>
                            <td></td>
                            <td></td>
                            <td></td>
                            <td></td>
                            <td></td>
                            <td></td>
                            <td></td>
                            <td></td>
                            <td></td>
                            <td></td>
                            <td></td>
                        </tr>
                        <tr>
                            <td>伊红美兰平板</td>
                            <td colspan="20"></td>
                        </tr>
                        <tr>
                            <td>报告值(MPN/100ml)</td>
                            <td colspan="20"></td>
                        </tr>
                        <tr>
                            <td rowspan="11">大肠埃希氏菌</td>
                            <td rowspan="4">发酵法</td>
                            <td>培养基名称</td>
                            <td colspan="20">EC-MUC培养基</td>
                        </tr>
                        <tr>
                            <td>稀释度（加样量）</td>
                            <td colspan="5">10ml</td>
                            <td colspan="5">1ml</td>
                            <td colspan="5">0.1ml</td>
                            <td colspan="5"></td>
                        </tr>
                        <tr>
                            <td>366nm紫外荧光</td>
                            <td></td>
                            <td></td>
                            <td></td>
                            <td></td>
                            <td></td>
                            <td></td>
                            <td></td>
                            <td></td>
                            <td></td>
                            <td></td>
                            <td></td>
                            <td></td>
                            <td></td>
                            <td></td>
                            <td></td>
                            <td></td>
                            <td></td>
                            <td></td>
                            <td></td>
                            <td></td>
                        </tr>
                        <tr>
                            <td>报告值（MPN/100ml）</td>
                            <td colspan="20"></td>
                        </tr>
                        <tr>
                            <td rowspan="7">酶底物法</td>
                            <td colspan="20">100ml水样加入2.7g±0.5 g MMU-MUG培养基粉末：摇匀使之溶解
                                </td>
                        </tr>
                        <tr>
                            <td>定性反应</td>
                            <td colspan="20"><span v-text="Hm"></span>℃培养<span v-text="hm"></span>h</td>
                        </tr>
                        <tr>
                            <td colspan="9">结果判读：
                                <label type="radio" for="">
                                    <input type="radio" name="" id="">无变化
                                    <input type="radio" name="" id="">变黄
                                    <input type="radio" name="" id="">有荧光
                                </label>
                            </td>
                            <td colspan="4">报告</td>
                            <td colspan="9"></td>
                        </tr>
                        <tr>
                            <td>10管法</td>
                            <td colspan="20">分装10管
                                <span v-text="T10"></span>℃
                                <span v-text="h10"></span>h
                            </td>
                        </tr>
                        <tr>
                            <td colspan="9">结果判读</td>
                            <td colspan="4">报告值（MPN/100ml）</td>
                            <td colspan="9"></td>
                        </tr>
                        <tr>
                            <td>51管法</td>
                            <td colspan="20">加入51孔定量盘内排气封口
                                <span v-text="T51"></span>℃
                                <span v-text="h51"></span>h
                            </td>
                        </tr>
                        <tr>
                            <td colspan="9">结果判读</td>
                            <td colspan="4">报告值（MPN/100ml）</td>
                            <td colspan="9"></td>
                        </tr>
                        <tr>
                            <td colspan="23">备注</td>
                        </tr>
                   </table>
                    <table @click="mystorages(selected4)" class="table table-bordered table-striped table-hover" id="record">
                        <thead>
                            <tr>
                                <th class="text-center">样品编号</th>
                                <th class="text-center">加样量(ml)</th>
                                <th class="text-center">吸光度</th>
                                <th class="text-center">实测质量(μg)</th>
                                <th class="text-center">样品浓度(mg/L)</th>
                                <th class="text-center">报告结果(mg/L)</th>
                                <th v-show="date_show" class="text-center">计量单位</th>
                                <th v-show="date_show" class="text-center">参考范围(mg/L)</th>
                                <th v-show="date_show" class="text-center">结果评价</th>
                                <th v-show="date_show" class="text-center">记录日期</th>
                            </tr>
                        </thead>
                        <tbody class="text-center">
                            <tr v-for="(item, index) in selected4.st" :key="index">
                                <td><i v-text="numbering+(new Date()).getFullYear()"></i>水第<span v-text="f_n(item.id, 3)">
                                    </span>号</td>
                                <td v-text="item.v"></td>
                                <td v-text="item.a"></td>
                                <td v-text="item.m"></td>
                                <td v-text="item.c"></td>
                                <td v-if="item.c<selected4.limit" v-text="'<'+selected4.limit"></td>
                                <td v-else v-text="item.c"></td>
                                <td v-show="date_show" v-text="item.unit"></td>
                                <td v-show="date_show" v-text="item.range"></td>
                                <td v-show="date_show" v-text="item.assessment"></td>
                                <td v-show="date_show" v-text="item.date"></td>
                            </tr>
                        </tbody>
                    </table>
                    <br><br>
                    <div class="row text-center">
                        <div class="col-lg-4 col-md-4 col-sm-4 col-xs-4">检验者：</div>
                        <div class="col-lg-4 col-md-4 col-sm-4 col-xs-4">审核者：</div>
                        <div class="col-lg-4 col-md-4 col-sm-4 col-xs-4">日期：
                            <span v-text="dateFormat(new Date())">
                            </span>
                        </div>
                    </div>
                </div>
            </form>
        </div>
    </div>
    <style>
    td{
        min-width: 3em;
    }
    </style>
    <script src="js/index.js"></script>
</body>
</html>